//底部导航栏
import 'package:flutter/material.dart';
import './page/home_screen.dart';
import './page/home_screen2.dart';
import './page/home_screen3.dart';
class BottomNavigationBarWidget extends StatefulWidget {
  @override
  _BottomNavigationBarWidgetState createState() => _BottomNavigationBarWidgetState();
}

class _BottomNavigationBarWidgetState extends State<BottomNavigationBarWidget> {
  final _BottomNavigationBarColor = Colors.blue;
  int _currIndex = 0;//当前切换的索引
  List<Widget> list = List();//List定义数组由于是页面所以是Widget的类型
  @override
  //initState载入
  void initState() { 
    list
      ..add(HomeScreen())
      ..add(HomeScreen2())
      ..add(HomeScreen3());
    super.initState();
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:list[_currIndex],
      bottomNavigationBar:BottomNavigationBar(
        items:[
          BottomNavigationBarItem(
            icon: Icon(
              Icons.home,
              color: _BottomNavigationBarColor,
            ),
            title:Text(
              'Home',
              style: TextStyle(
                color: _BottomNavigationBarColor
              ),
            )
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Icons.home,
              color: _BottomNavigationBarColor,
            ),
            title:Text(
              'Home2',
              style: TextStyle(
                color: _BottomNavigationBarColor
              ),
            )
          ),
          BottomNavigationBarItem(
            icon: Icon(
              Icons.home,
              color: _BottomNavigationBarColor,
            ),
            title:Text(
              'Home3',
              style: TextStyle(
                color: _BottomNavigationBarColor
              ),
            )
          )
        ],
        currentIndex: _currIndex,//当前高亮的索引
        onTap:(int index){
          //当前底部菜单栏被点击的事件，下面是设置变量
          setState(() {
           _currIndex = index; 
          });
        },
      )
    );
  }
}